<template>
    <div class="koi-flex">
        <KoiCard>

            <el-table :data="tableData" style="width: 100%">
                <el-table-column prop="date" label="消息模板描述" align="center">
                    <el-table-column prop="Id" label="消息标识符" align="center"></el-table-column>
                    <el-table-column prop="Name" label="消息名称" align="center"></el-table-column>
                    <el-table-column prop="Type" label="消息种类" align="center"></el-table-column>
                    <el-table-column prop="Parameters" label="消息字段" align="center">
                        <template #default="scope"> {{ scope.row.Parameters || "暂无" }}</template>
                    </el-table-column>
                </el-table-column>
                <el-table-column label="消息模板" align="center">
                    <el-table-column prop="Id" label="消息标识符" align="center"></el-table-column>
                    <el-table-column prop="Template" label="消息模板" align="center">
                        <template #default="scope">{{ scope.row.Template || "暂无" }}</template>
                    </el-table-column>
                    <el-table-column prop="DefaultSign" label="默认消息签名" align="center">
                        <template #default="scope">{{ scope.row.DefaultSign || "暂无" }}</template>
                    </el-table-column>
                </el-table-column>
            </el-table>

        </KoiCard>
    </div>
</template>

<script setup lang="ts" name="ttsPage">
import { ref, onMounted } from "vue";
import { koiNoticeError } from "@/utils/koi.ts";
import { getConfigInfo } from "@/api/system/settings";

const tableData = ref([]);
const handleRefresh = async () => {
    try {
        tableData.value = []
        const res: any = await getConfigInfo({ Type: 2 })
        tableData.value = res
        tableData.value = JSON.parse(JSON.stringify(res)).map((item: any) => {
            const obj = {};
            return Object.assign(obj, item.Descriptor, item.Template);
        });

    } catch (error) {
        koiNoticeError("获取配置信息失败，请重试🌻")
    }
}

onMounted(() => {
    // 获取数据表格数据
    handleRefresh();
});
</script>

<style lang="scss" scoped>
// 穿梭框高度调整
:deep(.el-transfer-panel__body) {
    height: 400px;
}
</style>